import './App.css'
import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom'
import { useStore } from './store'
import LoginPage from './LoginPage'
import HomePage from './HomePage'
import ProfileSettingsPage from './ProfileSettingsPage'
function App() {
  const { isLoggedIn } = useStore()

  return (
    <BrowserRouter>
      <Routes>
        <Route path="/login" element={!isLoggedIn ? <LoginPage /> : <Navigate to="/" />} />
        <Route 
          path="/" 
          element={isLoggedIn ? <HomePage /> : <Navigate to="/login" />} 
        />
        <Route path='/profile' element={<ProfileSettingsPage />} />
        <Route path="*" element={<Navigate to={isLoggedIn ? "/" : "/login"} />} />
      </Routes>
    </BrowserRouter>
  )
}

export default App
